<template>
  <div class="simple-test-container">
    <h2>出库产品明细API简化测试</h2>
    
    <el-card class="test-card">
      <template #header>
        <div class="card-header">
          <span>测试出库产品明细API</span>
        </div>
      </template>
      
      <div class="test-buttons">
        <el-button type="primary" @click="testGetAllDetails" :loading="loading.getAllDetails">
          获取所有明细
        </el-button>
        
        <el-button type="success" @click="testAddSimpleDetail" :loading="loading.addDetail">
          新增简单明细
        </el-button>
      </div>
      
      <div class="test-results">
        <h3>测试结果：</h3>
        <el-input
          v-model="testResult"
          type="textarea"
          :rows="10"
          placeholder="测试结果将显示在这里..."
          readonly
        />
      </div>
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue'
import { ElMessage } from 'element-plus'
import { MES_LXK_ApiHost } from '@/utils/Interceptors'

const testResult = ref('')
const loading = reactive({
  getAllDetails: false,
  addDetail: false
})

const logResult = (title: string, result: any) => {
  const timestamp = new Date().toLocaleString()
  const resultStr = JSON.stringify(result, null, 2)
  testResult.value = `[${timestamp}] ${title}:\n${resultStr}\n\n${testResult.value}`
}

// 测试获取所有出库产品明细
const testGetAllDetails = async () => {
  loading.getAllDetails = true
  try {
    const response = await MES_LXK_ApiHost.get('/api/OutboundProductDetail')
    logResult('获取所有出库产品明细', response.data)
    ElMessage.success('获取所有出库产品明细测试成功')
  } catch (error) {
    logResult('获取所有出库产品明细失败', error)
    ElMessage.error('获取所有出库产品明细测试失败')
  } finally {
    loading.getAllDetails = false
  }
}

// 测试新增简单明细
const testAddSimpleDetail = async () => {
  loading.addDetail = true
  try {
    const testData = {
      outboundOrderNumber: `TEST${Date.now()}`,
      productId: 1,
      currentInventoryQuantity: 100,
      outboundQuantity: 10,
      productName: '测试产品',
      productNumber: 'P000001',
      productSpecification: '测试规格',
      inventoryUnit: '个',
      maxInventory: 1000,
      minInventory: 100,
      safetyInventory: 200,
      inventoryQuantity: 500,
      createdBy: 'test',
      modifiedBy: 'test',
      createdTime: new Date().toISOString(),
      modifiedTime: new Date().toISOString(),
      isDelete: false
    }
    
    const response = await MES_LXK_ApiHost.post('/api/OutboundProductDetail/Add', testData)
    logResult('新增出库产品明细', { request: testData, response: response.data })
    ElMessage.success('新增出库产品明细测试成功')
  } catch (error) {
    logResult('新增出库产品明细失败', error)
    ElMessage.error('新增出库产品明细测试失败')
  } finally {
    loading.addDetail = false
  }
}
</script>

<style scoped>
.simple-test-container {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.test-card {
  margin-bottom: 20px;
}

.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.test-buttons {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.test-results {
  margin-top: 20px;
}

.test-results h3 {
  margin-bottom: 12px;
  color: #303133;
}
</style>

